@charset "utf-8";

@import "reset";
@import "common";

@function r($px) {
  @return $px/50px * 1rem;
}

.web {
  section {
    .kv {
      width: 100%;
      height: r(180px);
      img {
        width: 100%;
      }
    }
    .tabs {
      text-align: center;
      input[type="radio"] {
        display: none;
      }
      label {
        display: inline-block;
        width: r(200px);
        height: r(94px);
        line-height: r(94px);
        color: #8b8b8b;
        font-size: r(26px);
        text-align: center;
        border-bottom: r(1px) solid #dfdfdf;
      }
      .gimc_introduce {
        display: none;
      }
      .team_management {
        display: none;
      }
      .platform_strategy {
        display: none;
      }
      #inpu1:checked ~ .gimc_introduce {
        display: block;
      }
      #inpu1:checked ~ .labe1 {
        font-size: r(26px);
        color: white;
        background: #b20000;
      }
      #inpu2:checked ~ .team_management {
        display: block;
      }
      #inpu2:checked ~ .labe2 {
        font-size: r(26px);
        color: white;
        background: #b20000;
      }
      #inpu3:checked ~ .platform_strategy {
        display: block;
      }
      #inpu3:checked ~ .labe3 {
        font-size: r(26px);
        color: white;
        background: #b20000;
      }
      .gimc_introduce {
        width: r(640px);
        background: white;
        margin-top: r(22px);
        overflow: hidden;
        p {
          width: r(584px);
          color: #8b8b8b;
          font-size: r(20px);
          margin: r(28px) auto;
          text-align: justify;
          text-indent: r(40px);
        }
        .tabs_video {
          width: r(584px);
          padding: r(38px) 0;
          margin: 0 auto;
          border-top: r(1px) solid #e6e6e6;
          border-bottom: r(1px) solid #e6e6e6;
          video {
            width: 100%;
            height: r(338px);
          }
        }
        .history {
          width: r(582px);
          margin: 0 auto;
          dl {
            margin-top: r(10px);
            dt {
              width: 100%;
              height: r(80px);
              line-height: r(80px);
              background: #b20000;
              .jia {
                width: r(32px);
                height: r(32px);
                border-radius: r(20px);
                line-height: r(32px);
                border: r(4px) solid white;
                margin: r(20px) r(25px);
                i {
                  display: inline-block;
                  color: white;
                  font-size: r(26px);
                  vertical-align: top;
                }
              }
              p {
                width: r(220px);
                height: r(80px);
                font-size: r(30px);
                color: white;
                margin: 0;
                text-align: left;
                text-indent: 0;
              }
              .rili {
                width: r(42px);
                height: r(42px);
                line-height: r(26px);
                margin: r(20px) r(20px);
                i {
                  font-size: r(42px);
                  color: white;
                }
              }
            }
            dd {
              width: 100%;
              height: r(108px);
              overflow: hidden;
              .yuan {
                width: r(32px);
                height: r(32px);
                border-radius: 50%;
                border: r(6px) solid #d9e1e3;
                margin: r(30px) r(30px);
                z-index: 1;
                position: relative;
                background: white;
                .shiyaun {
                  width: r(10px);
                  height: r(10px);
                  border-radius: 50%;
                  margin: r(7px) auto;
                  background: #d9e1e3;
                  border: r(4px) solid #d9e1e3;
                }
              }
              p {
                width: r(450px);
                color: #000;
                height: r(32px);
                font-size: r(32px);
                margin: r(22px) 0 0 0;
                text-indent: 0;
              }
              span {
                font-size: r(20px);
                color: red;
              }
              &::after {
                display: inline-block;
                height: r(108px);
                border-left: r(4px) solid #d0dbdc;
                position: relative;
                left: r(-515px);
              }
              &:nth-of-type(2n) {
                background: #f3f3f3;
                .yuan {
                  border: r(6px) solid #b20000;
                  .shiyaun {
                    border: r(4px) solid #b20000;
                    background: #b20000;
                  }
                }
              }
            }
          }
        }
      }
    }
  }
}
